<!DOCTYPE html><html class=split lang=en-US-x-hixie><script src=../link-fixup.js defer=""></script>
<!-- Mirrored from html.spec.whatwg.org/dev/dynamic-markup-insertion.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 10 Sep 2025 08:36:28 GMT -->
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=utf-8" /><!-- /Added by HTTrack -->
<meta charset=utf-8><meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name=viewport><title>HTML Standard, Edition for Web Developers</title><meta content=#3c790a name=theme-color><meta content="light dark" name=color-scheme><link rel=stylesheet href=../../resources.whatwg.org/standard-shared-with-dev.css crossorigin=""><link rel=icon href=https://resources.whatwg.org/logo.svg crossorigin=""><link rel=stylesheet href=styles.css crossorigin=""><script>
   function toggleStatus(div) {
     div.parentNode.classList.toggle('wrapped');
   }
   function setLinkFragment(link) {
     link.hash = location.hash;
   }
  </script><body>
  <script async="" src=search.js></script>
  
  
  <header id=head class="head with-buttons">
   <a href=https://whatwg.org/ class=logo><img width=100 alt=WHATWG crossorigin="" class=darkmode-aware src=https://resources.whatwg.org/logo.svg height=100></a>
   
   <hgroup><h1><a rel=home href=index.html>HTML: The Living Standard</a></h1><p id=dev-edition-h2>Edition for Web Developers — Last Updated <span class=pubdate>10 September 2025</span></hgroup>
   

   <div id=search>
    <input placeholder="Search. Press '/'" autocomplete=off name=query id=query type=search>
    <ol id=results></ol>
   </div>
  </header>

  

  

  

  
  

  
  

  

  <nav><a href=webappapis.html>← 8 Web application APIs</a> — <a href=index.html>Table of Contents</a> — <a href=timers-and-user-prompts.html>8.6 Timers →</a></nav><ol class=toc><li><ol><li><a href=dynamic-markup-insertion.html#dynamic-markup-insertion><span class=secno>8.4</span> Dynamic markup insertion</a><ol><li><a href=dynamic-markup-insertion.html#opening-the-input-stream><span class=secno>8.4.1</span> Opening the input stream</a><li><a href=dynamic-markup-insertion.html#closing-the-input-stream><span class=secno>8.4.2</span> Closing the input stream</a><li><a href=dynamic-markup-insertion.html#document.write()><span class=secno>8.4.3</span> <code>document.write()</code></a><li><a href=dynamic-markup-insertion.html#document.writeln()><span class=secno>8.4.4</span> <code>document.writeln()</code></a></ol><li><a href=dynamic-markup-insertion.html#dom-parsing-and-serialization><span class=secno>8.5</span> DOM parsing and serialization APIs</a><ol><li><a href=dynamic-markup-insertion.html#the-domparser-interface><span class=secno>8.5.1</span> The <code>DOMParser</code> interface</a><li><a href=dynamic-markup-insertion.html#unsafe-html-parsing-methods><span class=secno>8.5.2</span> Unsafe HTML parsing methods</a><li><a href=dynamic-markup-insertion.html#html-serialization-methods><span class=secno>8.5.3</span> HTML serialization methods</a><li><a href=dynamic-markup-insertion.html#the-innerhtml-property><span class=secno>8.5.4</span> The <code>innerHTML</code> property</a><li><a href=dynamic-markup-insertion.html#the-outerhtml-property><span class=secno>8.5.5</span> The <code>outerHTML</code> property</a><li><a href=dynamic-markup-insertion.html#the-insertadjacenthtml()-method><span class=secno>8.5.6</span> The <code>insertAdjacentHTML()</code> method</a><li><a href=dynamic-markup-insertion.html#the-createcontextualfragment()-method><span class=secno>8.5.7</span> The <code>createContextualFragment()</code>
  method</a><li><a href=dynamic-markup-insertion.html#the-xmlserializer-interface><span class=secno>8.5.8</span> The <code>XMLSerializer</code> interface</a></ol></ol></ol><h3 id=dynamic-markup-insertion><span class=secno>8.4</span> <dfn>Dynamic markup insertion</dfn><a href=#dynamic-markup-insertion class=self-link></a></h3>

  <p class=note>APIs for dynamically inserting markup into the document interact with the parser,
  and thus their behavior varies depending on whether they are used with <a id=dynamic-markup-insertion:html-documents href=https://dom.spec.whatwg.org/#html-document data-x-internal=html-documents>HTML
  documents</a> (and the <span>HTML parser</span>) or <a id=dynamic-markup-insertion:xml-documents href=https://dom.spec.whatwg.org/#xml-document data-x-internal=xml-documents>XML documents</a> (and the
  <span>XML parser</span>).</p>

  



  <h4 id=opening-the-input-stream><span class=secno>8.4.1</span> Opening the input stream<a href=#opening-the-input-stream class=self-link></a></h4>

  <dl class=domintro><dt><code><var>document</var> = <var>document</var>.<span id=dom-document-open>open</span>()</code><dd>
    <p>Causes the <code>Document</code> to be replaced in-place, as if it was a new
    <code>Document</code> object, but reusing the previous object, which is then returned.</p>

    <p>The resulting <code>Document</code> has an HTML parser associated with it, which can be given
    data to parse using <code id=opening-the-input-stream:dom-document-write><a href=#dom-document-write>document.write()</a></code>.</p>

    <p>The method has no effect if the <code>Document</code> is still being parsed.</p>

    <p>Throws an <a id=opening-the-input-stream:invalidstateerror href=https://webidl.spec.whatwg.org/#invalidstateerror data-x-internal=invalidstateerror>"<code>InvalidStateError</code>"</a> <code id=opening-the-input-stream:domexception><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> if the
    <code>Document</code> is an <a href=https://dom.spec.whatwg.org/#xml-document id=opening-the-input-stream:xml-documents data-x-internal=xml-documents>XML document</a>.</p>

    <p>Throws an <a id=opening-the-input-stream:invalidstateerror-2 href=https://webidl.spec.whatwg.org/#invalidstateerror data-x-internal=invalidstateerror>"<code>InvalidStateError</code>"</a> <code id=opening-the-input-stream:domexception-2><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> if the
    parser is currently executing a <a id=opening-the-input-stream:custom-element-constructor href=custom-elements.html#custom-element-constructor>custom element constructor</a>.</p>
   <dt><code><var>window</var> = <var>document</var>.<span>open</span>(<var>url</var>, <var>name</var>, <var>features</var>)</code><dd><p>Works like the <code id=opening-the-input-stream:dom-open><a href=nav-history-apis.html#dom-open>window.open()</a></code> method.</dl>

  



  <h4 id=closing-the-input-stream><span class=secno>8.4.2</span> Closing the input stream<a href=#closing-the-input-stream class=self-link></a></h4>

  <dl class=domintro><dt><code><var>document</var>.<span id=dom-document-close>close</span>()</code><dd>
    <p>Closes the input stream that was opened by the <code id=closing-the-input-stream:dom-document-open><a href=#dom-document-open>document.open()</a></code> method.</p>

    <p>Throws an <a id=closing-the-input-stream:invalidstateerror href=https://webidl.spec.whatwg.org/#invalidstateerror data-x-internal=invalidstateerror>"<code>InvalidStateError</code>"</a> <code id=closing-the-input-stream:domexception><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> if the
    <code>Document</code> is an <a href=https://dom.spec.whatwg.org/#xml-document id=closing-the-input-stream:xml-documents data-x-internal=xml-documents>XML document</a>.</p>

    <p>Throws an <a id=closing-the-input-stream:invalidstateerror-2 href=https://webidl.spec.whatwg.org/#invalidstateerror data-x-internal=invalidstateerror>"<code>InvalidStateError</code>"</a> <code id=closing-the-input-stream:domexception-2><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> if the
    parser is currently executing a <a id=closing-the-input-stream:custom-element-constructor href=custom-elements.html#custom-element-constructor>custom element constructor</a>.</p>
   </dl>

  



  <h4 id=document.write()><span class=secno>8.4.3</span> <code id=document.write():dom-document-write><a href=#dom-document-write>document.write()</a></code><a href=#document.write() class=self-link></a></h4>

  <dl class=domintro><dt><code><var>document</var>.<span id=dom-document-write>write</span>(...<var>text</var>)</code><dd>
    <p>In general, adds the given string(s) to the <code>Document</code>'s input stream.</p>

    <p class=warning>This method has very idiosyncratic behavior. In some cases, this method can
    affect the state of the <span>HTML parser</span> while the parser is running, resulting in a DOM
    that does not correspond to the source of the document (e.g. if the string written is the string
    "<code>&lt;plaintext></code>" or "<code>&lt;!--</code>"). In other cases,
    the call can clear the current page first, as if <code id=document.write():dom-document-open><a href=#dom-document-open>document.open()</a></code> had been called. In yet more cases, the method
    is simply ignored, or throws an exception. User agents are <a href=#document-written-scripts-intervention>explicitly allowed to avoid executing
    <code>script</code> elements inserted via this method</a>. And to make matters even worse, the
    exact behavior of this method can in some cases be dependent on network latency, which can lead to failures that are very hard to debug. <strong>For all these reasons, use
    of this method is strongly discouraged.</strong></p>

    <p>Throws an <a id=document.write():invalidstateerror href=https://webidl.spec.whatwg.org/#invalidstateerror data-x-internal=invalidstateerror>"<code>InvalidStateError</code>"</a> <code id=document.write():domexception><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> when
    invoked on <a id=document.write():xml-documents href=https://dom.spec.whatwg.org/#xml-document data-x-internal=xml-documents>XML documents</a>.</p>

    <p>Throws an <a id=document.write():invalidstateerror-2 href=https://webidl.spec.whatwg.org/#invalidstateerror data-x-internal=invalidstateerror>"<code>InvalidStateError</code>"</a> <code id=document.write():domexception-2><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> if the
    parser is currently executing a <a id=document.write():custom-element-constructor href=custom-elements.html#custom-element-constructor>custom element constructor</a>.</p>
   </dl>

  <p class=warning>This method performs no sanitization to remove potentially-dangerous elements
  and attributes like <code id=document.write():the-script-element><a href=scripting.html#the-script-element>script</a></code> or <a id=document.write():event-handler-content-attributes href=webappapis.html#event-handler-content-attributes>event handler content attributes</a>.</p>

  


  <h4 id=document.writeln()><span class=secno>8.4.4</span> <code id=document.writeln():dom-document-writeln><a href=#dom-document-writeln>document.writeln()</a></code><a href=#document.writeln() class=self-link></a></h4>

  <dl class=domintro><dt><code><var>document</var>.<span id=dom-document-writeln>writeln</span>(...<var>text</var>)</code><dd>
    <p>Adds the given string(s) to the <code>Document</code>'s input stream, followed by a newline
    character. If necessary, calls the <code id=document.writeln():dom-document-open><a href=#dom-document-open>open()</a></code> method
    implicitly first.</p>

    <p class=warning>This method has very idiosyncratic behavior. <strong>Use of this
    method is strongly discouraged, for the same reasons as <code id=document.writeln():dom-document-write><a href=#dom-document-write>document.write()</a></code>.</strong></p>

    <p>Throws an <a id=document.writeln():invalidstateerror href=https://webidl.spec.whatwg.org/#invalidstateerror data-x-internal=invalidstateerror>"<code>InvalidStateError</code>"</a> <code id=document.writeln():domexception><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> when
    invoked on <a id=document.writeln():xml-documents href=https://dom.spec.whatwg.org/#xml-document data-x-internal=xml-documents>XML documents</a>.</p>

    <p>Throws an <a id=document.writeln():invalidstateerror-2 href=https://webidl.spec.whatwg.org/#invalidstateerror data-x-internal=invalidstateerror>"<code>InvalidStateError</code>"</a> <code id=document.writeln():domexception-2><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> if the
    parser is currently executing a <a id=document.writeln():custom-element-constructor href=custom-elements.html#custom-element-constructor>custom element constructor</a>.</p>
   </dl>

  <p class=warning>This method performs no sanitization to remove potentially-dangerous elements
  and attributes like <code id=document.writeln():the-script-element><a href=scripting.html#the-script-element>script</a></code> or <a id=document.writeln():event-handler-content-attributes href=webappapis.html#event-handler-content-attributes>event handler content attributes</a>.</p>

  


  <h3 id=dom-parsing-and-serialization><span class=secno>8.5</span> DOM parsing and serialization APIs<a href=#dom-parsing-and-serialization class=self-link></a></h3><div class="mdn-anno wrapped"><button onclick=toggleStatus(this) class=mdn-anno-btn><b title="Support in all current engines." class=all-engines-flag>✔</b><span>MDN</span></button><div class=feature><p><a href=https://developer.mozilla.org/en-US/docs/Web/API/DOMParser title="The DOMParser interface provides the ability to parse XML or HTML source code from a string into a DOM Document.">DOMParser</a><p class=all-engines-text>Support in all current engines.<div class=support><span class="firefox yes"><span>Firefox</span><span>1+</span></span><span class="safari yes"><span>Safari</span><span>1.3+</span></span><span class="chrome yes"><span>Chrome</span><span>1+</span></span><hr><span class="opera yes"><span>Opera</span><span>8+</span></span><span class="edge_blink yes"><span>Edge</span><span>79+</span></span><hr><span class="edge yes"><span>Edge (Legacy)</span><span>12+</span></span><span class="ie yes"><span>Internet Explorer</span><span>9+</span></span><hr><span class="firefox_android unknown"><span>Firefox Android</span><span>?</span></span><span class="safari_ios unknown"><span>Safari iOS</span><span>?</span></span><span class="chrome_android unknown"><span>Chrome Android</span><span>?</span></span><span class="webview_android unknown"><span>WebView Android</span><span>?</span></span><span class="samsunginternet_android unknown"><span>Samsung Internet</span><span>?</span></span><span class="opera_android yes"><span>Opera Android</span><span>10.1+</span></span></div></div></div>

  

  <h4 id=the-domparser-interface><span class=secno>8.5.1</span> The <code>DOMParser</code> interface<a href=#the-domparser-interface class=self-link></a></h4>

  <p>The <code>DOMParser</code> interface allows authors to create new <code>Document</code> objects
  by parsing strings, as either HTML or XML.</p>

  <dl class=domintro><dt><code><var>parser</var> = new <span id=dom-domparser-constructor>DOMParser</span>()</code><dd><p>Constructs a new <code>DOMParser</code> object.<dt><code><var>document</var> = <var>parser</var>.<span id=dom-domparser-parsefromstring>parseFromString</span>(<var>string</var>, <var>type</var>)</code><dd>
    <p>Parses <var>string</var> using either the HTML or XML parser, according to <var>type</var>,
    and returns the resulting <code>Document</code>. <var>type</var> can be "<code>text/html</code>"
    (which will invoke the HTML parser), or any of "<code id=the-domparser-interface:text/xml><a href=indices.html#text/xml>text/xml</a></code>",
    "<code id=the-domparser-interface:application/xml><a href=indices.html#application/xml>application/xml</a></code>", "<code>application/xhtml+xml</code>", or
    "<code id=the-domparser-interface:image/svg+xml><a href=indices.html#image/svg+xml>image/svg+xml</a></code>" (which will invoke the XML parser).</p>

    <p>For the XML parser, if <var>string</var> cannot be parsed, then the returned
    <code>Document</code> will contain elements describing the resulting error.</p>

    <p>Note that <code id=the-domparser-interface:the-script-element><a href=scripting.html#the-script-element>script</a></code> elements are not evaluated during parsing, and the resulting
    document's <a href=https://dom.spec.whatwg.org/#concept-document-encoding id="the-domparser-interface:document's-character-encoding" data-x-internal="document's-character-encoding">encoding</a> will always be
    <span>UTF-8</span>. The document's <a href=https://dom.spec.whatwg.org/#concept-document-url id="the-domparser-interface:the-document's-address" data-x-internal="the-document's-address">URL</a> will be
    inherited from <var>parser</var>'s <span>relevant global object</span>.</p>

    <p>Values other than the above for <var>type</var> will cause a <code id=the-domparser-interface:typeerror><a data-x-internal=typeerror href=https://tc39.es/ecma262/#sec-native-error-types-used-in-this-standard-typeerror>TypeError</a></code> exception
    to be thrown.</p>
   </dl>

  <p class=note>The design of <code>DOMParser</code>, as a class that needs to be constructed and
  then have its <code id=the-domparser-interface:dom-domparser-parsefromstring><a href=#dom-domparser-parsefromstring>parseFromString()</a></code> method
  called, is an unfortunate historical artifact. If we were designing this functionality today it
  would be a standalone function. For parsing HTML, the modern alternative is <code>Document.parseHTMLUnsafe()</code>.</p>

  <p class=warning>This method performs no sanitization to remove potentially-dangerous elements
  and attributes like <code id=the-domparser-interface:the-script-element-2><a href=scripting.html#the-script-element>script</a></code> or <a id=the-domparser-interface:event-handler-content-attributes href=webappapis.html#event-handler-content-attributes>event handler content attributes</a>.</p>

  

  

  <h4 id=unsafe-html-parsing-methods><span class=secno>8.5.2</span> Unsafe HTML parsing methods<a href=#unsafe-html-parsing-methods class=self-link></a></h4>

  <dl class=domintro><dt><code><var>element</var>.<span id=dom-element-sethtmlunsafe>setHTMLUnsafe</span>(<var>html</var>)</code><dd>
    <p>Parses <var>html</var> using the HTML parser, and replaces the children of <var>element</var>
    with the result. <var>element</var> provides context for the HTML parser.</p>
   <dt><code><var>shadowRoot</var>.<span id=dom-shadowroot-sethtmlunsafe>setHTMLUnsafe</span>(<var>html</var>)</code><dd>
    <p>Parses <var>html</var> using the HTML parser, and replaces the children of
    <var>shadowRoot</var> with the result. <var>shadowRoot</var>'s <a href=https://dom.spec.whatwg.org/#concept-documentfragment-host id=unsafe-html-parsing-methods:concept-documentfragment-host data-x-internal=concept-documentfragment-host>host</a> provides context for the HTML parser.</p>
   <dt><code><var>doc</var> = Document.<span>parseHTMLUnsafe</span>(<var>html</var>)</code><dd>
    <p>Parses <var>html</var> using the HTML parser, and returns the resulting
    <code>Document</code>.</p>

    <p>Note that <code id=unsafe-html-parsing-methods:the-script-element><a href=scripting.html#the-script-element>script</a></code> elements are not evaluated during parsing, and the resulting
    document's <a href=https://dom.spec.whatwg.org/#concept-document-encoding id="unsafe-html-parsing-methods:document's-character-encoding" data-x-internal="document's-character-encoding">encoding</a> will always be
    <span>UTF-8</span>. The document's <a href=https://dom.spec.whatwg.org/#concept-document-url id="unsafe-html-parsing-methods:the-document's-address" data-x-internal="the-document's-address">URL</a> will be
    <code id=unsafe-html-parsing-methods:about:blank><a href=infrastructure.html#about:blank>about:blank</a></code>.</p>
   </dl>

  <p class=warning>These methods perform no sanitization to remove potentially-dangerous elements
  and attributes like <code id=unsafe-html-parsing-methods:the-script-element-2><a href=scripting.html#the-script-element>script</a></code> or <a id=unsafe-html-parsing-methods:event-handler-content-attributes href=webappapis.html#event-handler-content-attributes>event handler content attributes</a>.</p>

  

  <h4 id=html-serialization-methods><span class=secno>8.5.3</span> HTML serialization methods<a href=#html-serialization-methods class=self-link></a></h4>

  <dl class=domintro><dt><code><var>html</var> = <var>element</var>.<span id=dom-element-gethtml>getHTML</span>({ <span>serializableShadowRoots</span>, <span>shadowRoots</span> })</code><dd>
    <p>Returns the result of serializing <var>element</var> to HTML. <a href=https://dom.spec.whatwg.org/#concept-shadow-root id=html-serialization-methods:shadow-root data-x-internal=shadow-root>Shadow roots</a> within <var>element</var> are serialized according to the provided options:</p>

    <ul><li><p>If <code>serializableShadowRoots</code> is true, then all shadow roots marked as <a href=https://dom.spec.whatwg.org/#shadowroot-serializable id=html-serialization-methods:shadow-serializable data-x-internal=shadow-serializable>serializable</a> are serialized.<li><p>If the <code>shadowRoots</code> array is provided, then all shadow roots specified in the array are serialized, regardless of whether or not they are marked as serializable.</ul>

    <p>If neither option is provided, then no shadow roots are serialized.</p>
   <dt><code><var>html</var> = <var>shadowRoot</var>.<span id=dom-shadowroot-gethtml>getHTML</span>({ <span>serializableShadowRoots</span>, <span>shadowRoots</span> })</code><dd>
    <p>Returns the result of serializing <var>shadowRoot</var> to HTML, using its <a href=https://dom.spec.whatwg.org/#concept-documentfragment-host id=html-serialization-methods:concept-documentfragment-host data-x-internal=concept-documentfragment-host>shadow host</a> as the context element. <a href=https://dom.spec.whatwg.org/#concept-shadow-root id=html-serialization-methods:shadow-root-2 data-x-internal=shadow-root>Shadow roots</a> within <var>shadowRoot</var> are serialized according to the provided options, as above.</p>
   </dl>

  

  <h4 id=the-innerhtml-property><span class=secno>8.5.4</span> The <code id=the-innerhtml-property:dom-element-innerhtml><a href=#dom-element-innerhtml>innerHTML</a></code> property<a href=#the-innerhtml-property class=self-link></a></h4>

  <p class=XXX>The <code id=the-innerhtml-property:dom-element-innerhtml-2><a href=#dom-element-innerhtml>innerHTML</a></code> property has a number of outstanding issues
  in the <cite>DOM Parsing and Serialization</cite> <a href=https://github.com/w3c/DOM-Parsing/issues>issue
  tracker</a>, documenting various problems with its specification.</p>

  <dl class=domintro><dt><code><var>element</var>.<span id=dom-element-innerhtml>innerHTML</span></code><dd>
    <p>Returns a fragment of HTML or XML that represents the element's contents.</p>

    <p>In the case of an XML document, throws an <a id=the-innerhtml-property:invalidstateerror href=https://webidl.spec.whatwg.org/#invalidstateerror data-x-internal=invalidstateerror>"<code>InvalidStateError</code>"</a>
    <code id=the-innerhtml-property:domexception><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> if the element cannot be serialized to XML.</p>
   <dt><code><var>element</var>.<a href=#dom-element-innerhtml id=the-innerhtml-property:dom-element-innerhtml-3>innerHTML</a> = <var>value</var></code><dd>
    <p>Replaces the contents of the element with nodes parsed from the given string.</p>

    <p>In the case of an XML document, throws a <a id=the-innerhtml-property:syntaxerror href=https://webidl.spec.whatwg.org/#syntaxerror data-x-internal=syntaxerror>"<code>SyntaxError</code>"</a>
    <code id=the-innerhtml-property:domexception-2><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> if the given string is not well-formed.</p>
   <dt><code><var>shadowRoot</var>.<span id=dom-shadowroot-innerhtml>innerHTML</span></code><dd>
    <p>Returns a fragment of HTML that represents the shadow roots's contents.</p>
   <dt><code><var>shadowRoot</var>.<a href=#dom-shadowroot-innerhtml id=the-innerhtml-property:dom-shadowroot-innerhtml>innerHTML</a> = <var>value</var></code><dd>
    <p>Replaces the contents of the shadow root with nodes parsed from the given string.</p>
   </dl>

  <p class=warning>These properties' setters perform no sanitization to remove
  potentially-dangerous elements and attributes like <code id=the-innerhtml-property:the-script-element><a href=scripting.html#the-script-element>script</a></code> or <a id=the-innerhtml-property:event-handler-content-attributes href=webappapis.html#event-handler-content-attributes>event handler
  content attributes</a>.</p>

  

  <h4 id=the-outerhtml-property><span class=secno>8.5.5</span> The <code id=the-outerhtml-property:dom-element-outerhtml><a href=#dom-element-outerhtml>outerHTML</a></code> property<a href=#the-outerhtml-property class=self-link></a></h4>

  <p class=XXX>The <code id=the-outerhtml-property:dom-element-outerhtml-2><a href=#dom-element-outerhtml>outerHTML</a></code> property has a number of outstanding issues
  in the <cite>DOM Parsing and Serialization</cite> <a href=https://github.com/w3c/DOM-Parsing/issues>issue
  tracker</a>, documenting various problems with its specification.</p>

  <dl class=domintro><dt><code><var>element</var>.<span id=dom-element-outerhtml>outerHTML</span></code><dd>
    <p>Returns a fragment of HTML or XML that represents the element and its contents.</p>

    <p>In the case of an XML document, throws an <a id=the-outerhtml-property:invalidstateerror href=https://webidl.spec.whatwg.org/#invalidstateerror data-x-internal=invalidstateerror>"<code>InvalidStateError</code>"</a>
    <code id=the-outerhtml-property:domexception><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> if the element cannot be serialized to XML.</p>
   <dt><code><var>element</var>.<a href=#dom-element-outerhtml id=the-outerhtml-property:dom-element-outerhtml-3>outerHTML</a> = <var>value</var></code><dd>
    <p>Replaces the element with nodes parsed from the given string.</p>

    <p>In the case of an XML document, throws a <a id=the-outerhtml-property:syntaxerror href=https://webidl.spec.whatwg.org/#syntaxerror data-x-internal=syntaxerror>"<code>SyntaxError</code>"</a>
    <code id=the-outerhtml-property:domexception-2><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> if the given string is not well-formed.</p>

    <p>Throws a <a id=the-outerhtml-property:nomodificationallowederror href=https://webidl.spec.whatwg.org/#nomodificationallowederror data-x-internal=nomodificationallowederror>"<code>NoModificationAllowedError</code>"</a> <code id=the-outerhtml-property:domexception-3><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> if
    the parent of the element is a <span><code>Document</code></span>.</p>
   </dl>

  <p class=warning>This property's setter performs no sanitization to remove potentially-dangerous
  elements and attributes like <code id=the-outerhtml-property:the-script-element><a href=scripting.html#the-script-element>script</a></code> or <a id=the-outerhtml-property:event-handler-content-attributes href=webappapis.html#event-handler-content-attributes>event handler content
  attributes</a>.</p>

  

  <h4 id=the-insertadjacenthtml()-method><span class=secno>8.5.6</span> The <code id=the-insertadjacenthtml()-method:dom-element-insertadjacenthtml><a href=#dom-element-insertadjacenthtml>insertAdjacentHTML()</a></code> method<a href=#the-insertadjacenthtml()-method class=self-link></a></h4>

  <p class=XXX>The <code id=the-insertadjacenthtml()-method:dom-element-insertadjacenthtml-2><a href=#dom-element-insertadjacenthtml>insertAdjacentHTML()</a></code>
  method has a number of outstanding issues in the <cite>DOM Parsing and Serialization</cite> <a href=https://github.com/w3c/DOM-Parsing/issues>issue tracker</a>, documenting various problems
  with its specification.</p>

  <dl class=domintro><dt><code><var>element</var>.<span id=dom-element-insertadjacenthtml>insertAdjacentHTML</span>(<var>position</var>, <var>string</var>)</code><dd>
    <p>Parses <var>string</var> as HTML or XML and inserts the resulting nodes into the tree in
    the position given by the <var>position</var> argument, as follows:</p>

    <dl><dt>"<code>beforebegin</code>"<dd>Before the element itself (i.e., after <var>element</var>'s previous sibling)<dt>"<code>afterbegin</code>"<dd>Just inside the element, before its first child.<dt>"<code>beforeend</code>"<dd>Just inside the element, after its last child.<dt>"<code>afterend</code>"<dd>After the element itself (i.e., before <var>element</var>'s next sibling)</dl>

    <p>Throws a <a id=the-insertadjacenthtml()-method:syntaxerror href=https://webidl.spec.whatwg.org/#syntaxerror data-x-internal=syntaxerror>"<code>SyntaxError</code>"</a> <code id=the-insertadjacenthtml()-method:domexception><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> if the arguments
    have invalid values (e.g., in the case of an <a href=https://dom.spec.whatwg.org/#xml-document id=the-insertadjacenthtml()-method:xml-documents data-x-internal=xml-documents>XML document</a>,
    if the given string is not well-formed).</p>

    <p>Throws a <a id=the-insertadjacenthtml()-method:nomodificationallowederror href=https://webidl.spec.whatwg.org/#nomodificationallowederror data-x-internal=nomodificationallowederror>"<code>NoModificationAllowedError</code>"</a> <code id=the-insertadjacenthtml()-method:domexception-2><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code>
    if the given position isn't possible (e.g. inserting elements after the root element of a
    <code>Document</code>).</p>
   </dl>

  <p class=warning>This method performs no sanitization to remove potentially-dangerous elements
  and attributes like <code id=the-insertadjacenthtml()-method:the-script-element><a href=scripting.html#the-script-element>script</a></code> or <a id=the-insertadjacenthtml()-method:event-handler-content-attributes href=webappapis.html#event-handler-content-attributes>event handler content attributes</a>.</p>

  

  <h4 id=the-createcontextualfragment()-method><span class=secno>8.5.7</span> The <code id=the-createcontextualfragment()-method:dom-range-createcontextualfragment><a href=#dom-range-createcontextualfragment>createContextualFragment()</a></code>
  method<a href=#the-createcontextualfragment()-method class=self-link></a></h4>

  <p class=XXX>The <code id=the-createcontextualfragment()-method:dom-range-createcontextualfragment-2><a href=#dom-range-createcontextualfragment>createContextualFragment()</a></code> method has a number
  of outstanding issues in the <cite>DOM Parsing and Serialization</cite> <a href=https://github.com/w3c/DOM-Parsing/issues>issue tracker</a>, documenting various problems
  with its specification.</p>

  <dl class=domintro><dt><code><var>docFragment</var> = <var>range</var>.<span id=dom-range-createcontextualfragment>createContextualFragment</span>(<var>string</var>)</code><dd>
    <p>Returns a <code id=the-createcontextualfragment()-method:documentfragment><a data-x-internal=documentfragment href=https://dom.spec.whatwg.org/#interface-documentfragment>DocumentFragment</a></code> created from the markup string <var>string</var> using
    <var>range</var>'s <a href=https://dom.spec.whatwg.org/#concept-range-start-node id=the-createcontextualfragment()-method:concept-range-start-node data-x-internal=concept-range-start-node>start node</a> as the context in
    which <var>fragment</var> is parsed.</p>
   </dl>

  <p class=warning>This method performs no sanitization to remove potentially-dangerous elements
  and attributes like <code id=the-createcontextualfragment()-method:the-script-element><a href=scripting.html#the-script-element>script</a></code> or <a id=the-createcontextualfragment()-method:event-handler-content-attributes href=webappapis.html#event-handler-content-attributes>event handler content attributes</a>.</p>

  

  

  <h4 id=the-xmlserializer-interface><span class=secno>8.5.8</span> The <code>XMLSerializer</code> interface<a href=#the-xmlserializer-interface class=self-link></a></h4>

  <p class=XXX>The <code>XMLSerializer</code> interface has a number of outstanding issues in the
  <cite>DOM Parsing and Serialization</cite> <a href=https://github.com/w3c/DOM-Parsing/issues>issue tracker</a>, documenting various problems
  with its specification. The remainder of <cite>DOM Parsing and Serialization</cite> will be
  gradually upstreamed to this specification.</p>

  <dl class=domintro><dt><code><var>xmlSerializer</var> = new <span id=dom-xmlserializer-constructor>XMLSerializer</span>()</code><dd><p>Constructs a new <code>XMLSerializer</code> object.<dt><code><var>string</var> = <var>xmlSerializer</var>.<span id=dom-xmlserializer-serializetostring>serializeToString</span>(<var>root</var>)</code><dd>
    <p>Returns the result of serializing <var>root</var> to XML.</p>

    <p>Throws an <a id=the-xmlserializer-interface:invalidstateerror href=https://webidl.spec.whatwg.org/#invalidstateerror data-x-internal=invalidstateerror>"<code>InvalidStateError</code>"</a> <code id=the-xmlserializer-interface:domexception><a data-x-internal=domexception href=https://webidl.spec.whatwg.org/#dfn-DOMException>DOMException</a></code> if
    <var>root</var> cannot be serialized to XML.</p>
   </dl>

  <p class=note>The design of <code>XMLSerializer</code>, as a class that needs to be constructed
  and then have its <code id=the-xmlserializer-interface:dom-xmlserializer-serializetostring><a href=#dom-xmlserializer-serializetostring>serializeToString()</a></code>
  method called, is an unfortunate historical artifact. If we were designing this functionality
  today it would be a standalone function.</p>

  

  

  <nav><a href=webappapis.html>← 8 Web application APIs</a> — <a href=index.html>Table of Contents</a> — <a href=timers-and-user-prompts.html>8.6 Timers →</a></nav>
